<template>
  <!-- <div class="guanzhugongzhonghao">
      <img :src="require('@/assets/preview/app/i-module-guanzhugongzhonghao.png')">
  </div> -->

  <div class="guide_follow">
    <div class="guide_wechat" :style="type === 0 ? 'height:60px' : ''">
        <div class="official_account_box" v-if="type === 0 || !type">
            <img :src="require('@/assets/preview/app/i-module-guanzhugongzhonghao.png')">
        </div>
        <div class="official_image_box" v-if="type === 1">
            <img class="official_image" :src="fileBaseUrl + pic" />
        </div>
    </div>
</div>
</template>

<script>
export default {
  props: {
    module: {
      type: Object,
    },
    fileBaseUrl: {
      type: String,
    },
  },
  data() {
    return {
      type: 0,
      pic: ''
    }
  },
  watch: {
    module: {
      handler(module) {
        const { biz } = module
        console.log(module)
        if(!biz?.params) return
        if(biz.params && typeof biz.params === 'string') {
          this.type = JSON.parse(biz.params).type
          this.pic = module.pic
          return
        }
        this.type = biz.params.type
        this.pic = module.pic
      },
      deep: true,
      immediate: true
    }
  },
};
</script>

<style lang="scss" scoped>
.guide_wechat {
    margin: 10px 15px 0;
    position: relative;
    background: #fff;
    overflow: hidden;
    display: flex;
    border-radius: 4px;
    align-items: center;
    justify-content: center;
    .official_account_box {
      position: absolute;
      bottom: -3px;
      width: 102%;
    }
    .official_image_box  {
      width: 100%;
      height: 100%;
      .official_image {
        width: 100%;
      }
    }

}

</style>
